<template>
    <div>
        <div>
            <div>项目代码：<span class="span-font">{{ clinicItemInfo.itemCode }}</span> /
                项目名称：<span class="span-font">{{ clinicItemInfo.itemName }}</span></div>
        </div>
        <div class="text item">
            <el-table :data="checkedData" :border="true" height="250px" highlight-current-row :stripe="true"
                :header-cell-style="$headerCellStyle">
                <el-table-column :show-overflow-tooltip="true" :align="'left'" label="项目分类" prop="itemClass" width="70px">
                    <template #default="scope">
                        <dict-data-tag :options="dictDataMap['bill_item_class_dict']" :value="scope.row.itemClass" />
                    </template>
                </el-table-column>
                <el-table-column :show-overflow-tooltip="true" label="项目代码" property="itemCode"
                    width="117"></el-table-column>
                <el-table-column :show-overflow-tooltip="true" label="项目名称" property="itemName"></el-table-column>
                <el-table-column :show-overflow-tooltip="true" label="项目规格" property="itemSpec"
                    width="100"></el-table-column>
                <el-table-column :show-overflow-tooltip="true" :align="'center'" label="项目单位" property="units" width="75">
                    <template #default="scope">
                        <dict-data-tag :options="dictDataMap['spec_unit']" :value="scope.row.units" />
                    </template>
                </el-table-column>
                <el-table-column :show-overflow-tooltip="true" label="项目单价(元)" property="price"
                    width="100"></el-table-column>
                <el-table-column :show-overflow-tooltip="true" label="数量" property="clinicVsPriceVo.amount" width="70" />
                <el-table-column :show-overflow-tooltip="true" label="小计(元)" property="subTotal" width="74" />
                <el-table-column v-if="isShowOperation" :align="'left'" class-name="small-padding fixed-width" label="操作"
                    width="90">
                    <template #default="scope">
                        <el-button type="danger" @click="handleDelete(scope.row)"><template
                                #icon><i-ep-delete /></template>删除
                        </el-button>
                    </template>
                </el-table-column>
            </el-table>
            <div style="float: right;margin-top: 5px">合计：{{ parseFloat(totalAmount.toString()).toFixed(2) }} 元 / 共计
                {{ checkedData.length }} 个项目
            </div>
        </div>
    </div>
</template>

<script lang="ts" setup>
import {selectContrastExist} from "@/api/base/priceList";
import {delClinicVsPrice} from "@/api/base/clinicVsPrice";
import {useDictStoreHook} from "@/store/modules/dict";

const { proxy } = getCurrentInstance() as any
const dictStore = useDictStoreHook()
const dictDataMap = ref(dictStore.isTypeGetData('bill_item_class_dict', 'spec_unit'))
// 已对照价表list
const checkedData = ref([])
// 总金额
const totalAmount = ref<number>(0.00)
const props = defineProps({
    clinicItemInfo: {
        type: Object,
        default: () => ({})
    },
    isShowOperation: {
        type: Boolean,
        default: false
    }
})

watch(() => props.clinicItemInfo, (_newValue, _oldValue) => {
    nextTick(() => {
        init()
    })
}, { deep: true, immediate: true })
// onMounted(() => [
//     nextTick(() => {
//         init()
//     })
// ])

function init() {
    selectContrastExistFun()
}
/** 获取诊疗项目已对照的价表 */
function selectContrastExistFun() {
    if (props.clinicItemInfo.clinicId || props.clinicItemInfo.clinicItemId) {
        selectContrastExist(props.clinicItemInfo).then(res => {
            checkedData.value = res.data
            let subTotal: number = 0
            checkedData.value.forEach((item: any) => {
                subTotal += item.subTotal
            })
            totalAmount.value = subTotal
        })
    }
}
/** 删除按钮操作 */
function handleDelete(row) {
    ElMessageBox.confirm('是否确认删除对照名称为"' + row.itemName + '"的数据？',
        {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
        }).then(() => {
            const data = {
                clinicItemId: row.clinicVsPriceVo.clinicItemId,
                priceId: row.priceId
            }
            delClinicVsPrice(data).then(() => {
                selectContrastExistFun()
                ElMessage.success("删除成功");
            })
        }).then(() => {
        }).catch(() => {
        })
}

defineExpose({
    selectContrastExistFun
})
</script>
<script lang = "ts" >
export default {
    name: "priceCheckedTable"
}
</script>
